<template>
  <div class="sto-view">
    <!--视图-->
    <el-row>
      <el-col :span="20" :offset="2" style="color: #333333">
        <el-row class="b-g-f p-10-20 border-style">
          <el-row>
            <div class="dialog__header">
              <span class="dialog__title">入库单</span>
            </div>
          </el-row>
          <el-form :model="storage" label-width="100px">
            <el-divider><span class="font-14-bold"></span></el-divider>
            <el-row>
              <el-col>
                <el-form-item label="主题:">
                  <el-input v-model="storage.storageTheme" style="width: 91%"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="仓库:">
                  <el-select v-model="storage.warehouseByWarehouseId" value-key="warehouseId" placeholder="未选" style="width: 79%">
                    <el-option :disabled="true" v-for="item in warehouseList" :key="item.warehouseId" :label="item.warehouseName" :value="item">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="填单时间:">
                  <el-input :disabled="true" v-model="storage.storageDate" style="width: 79%"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="状态:">
                  <el-select v-model="storage.storageStatus" placeholder="未选" style="width: 79%">
                    <el-option :disabled="true" v-for="item in ztsOptions" :key="item.value" :label="item.label" :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="填单人:">
                  <el-input :disabled="true" v-model="storage.employeeByStoEmployeeId.empName" style="width: 79%"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="库管确认:">
                  <el-input v-if="this.storage.employeeByAffEmployeeId !== null" :disabled="true" v-model="storage.employeeByAffEmployeeId.empName" style="width: 79%"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="执行时间:">
                  <el-input :disabled="true" v-model="storage.storageExecutorDate" style="width: 79%"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="对应采购单:">
                  <el-input :disabled="true" v-model="storage.purchaseByPurchaseId.purchaseTheme" style="width: 79%"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="对应退货单:">
                  <el-input v-if="this.storage.returnByReturnId !== null" :disabled="true" v-model="storage.returnByReturnId.returnTheme" style="width: 79%"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="对应供应商:">
                  <el-input :disabled="true" v-model="storage.customerByCustomerId.customerName" style="width: 79%"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="备注:">
                  <el-input v-model="storage.storageNote" style="width: 91%" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col>
                <el-form-item label="入库明细:" style="width: 92%">
                  <el-row>
                    <el-row>
                      <el-col :span="2" :offset="22">
                        <span v-if="storage.storageStatus === 1" class="cursor" @click="openPro"><i class="el-icon-edit"></i>编辑明细</span>
                      </el-col>
                    </el-row>
                    <div class="detail">
                      <el-table :data="detailList" style="width: 100%" border show-summary>
                        <el-table-column type="index" label="序号" width="50" >
                        </el-table-column>
                        <el-table-column prop="productByProductId.productName" label="产品名" >
                        </el-table-column>
                        <el-table-column prop="productByProductId.productModel" label="型号" >
                        </el-table-column>
                        <el-table-column prop="storageDetailNum" label="入库量" >
                        </el-table-column>
                        <el-table-column prop="storageDetailNote" label="备注" >
                        </el-table-column>
                      </el-table>
                    </div>
                  </el-row>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12" :offset="8">
                <el-form-item>
                  <div v-if="storage.storageStatus === 1">
                    <el-button @click="addStorage" type="primary">保存</el-button>
                    <el-button @click="repealInv" type="primary" plain>入库</el-button>
                  </div>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-row>
      </el-col>
      <!--抽屉弹框-->
      <el-drawer title="编辑入库明细" size="50%" :visible.sync="drawer" @close="closeDrawer"
                  style="font-size:20px;color:black">
        <div class="detail">
          <el-table :data="editDetailList" style="width: 100%" border show-summary>
            <el-table-column type="index" label="序号" width="50">
            </el-table-column>
            <el-table-column prop="productByProductId.productName" label="产品名" >
            </el-table-column>
            <el-table-column prop="productByProductId.productModel" label="型号" >
            </el-table-column>
            <el-table-column label="入库量" width="150">
              <template slot-scope="scope">
                <el-input-number v-model="scope.row.storageDetailNum" :min="1" :max="scope.row.storageDetailNum" size="mini" label="描述文字"></el-input-number>
              </template>
            </el-table-column>
            <el-table-column label="备注" >
              <template slot-scope="scope">
                <el-input v-model="scope.row.storageDetailNote" size="small"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="操作" >
              <template slot-scope="scope">
                <el-tooltip class="item" effect="dark" content="删除" placement="bottom">
                  <el-button size="mini" @click="deleteDetail(scope.row)" icon="el-icon-delete" type="danger" circle></el-button>
                </el-tooltip>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <el-row>
          <el-col class="m-t-20 m-l-20">
            <el-button @click="saveDetail"  type="primary">确认</el-button>
            <el-button @click="drawer = false">取消</el-button>
          </el-col>
        </el-row>
      </el-drawer>
    </el-row>
  </div>
</template>

<script>
  import {formatTimeToStr} from '../assets/format.js'
  export default {
    data () {
      return {
        emp:{},
        detailList: [],//明细集合
        // 入库
        storage: {
          storageId: 0,
          storageTheme: '',
          storageDate: '',
          storageStatus: '',
          storageNote: '',
          storageExecutorDate: '',
          customerByCustomerId: '',
          employeeByStoEmployeeId: '',
          employeeByAffEmployeeId: '',
          purchaseByPurchaseId: '',
          returnByReturnId: '',
          warehouseByWarehouseId: ''
        },
        // 采购
        purchase: {
          purchaseId: 0,
          purchaseTheme: '',
          purchaseNo: '',
          purchaseDate: '',
          purchasePredictDate: '',
          purchaseStatus: '',
          purchaseSort: '',
          purchaseAmount: '',
          purchaseNote: '',
          purchaseContactName: '',
          purchaseBill: null,
          purchasePaid: null,
          purchaseAppStatus: 0,
          purchaseReturn: 1,
          customerByCustomerId: '',
          employeeByEmpId: '',
          customerByConCustomerId:'',
          contractByContractId:'',
          employeeByAppEmpId:'',
          warehouseByWarehouseId:''
        },
        purDetailList:[],// 采购明细集合
        // 库存
        inventory: {
          inventoryId: 0,
          inventoryNum: '',
          warehouseByWarehouseId: '',
          productByProductId: '',
        },
        inventoryList: [], // 库存集合
        warehouseList: [],// 仓库集合
        drawer: false, //抽屉
        editDetailList: [],//明细操作集
        ztsOptions: [{
          value: 1,
          label: '未入库'
        },{
          value: 2,
          label: '已入库'
        }],
      }
    },
    methods: {
      // 查询当前员工
      loginEmp(){
        this.$axios.get('http://localhost:8088/emp')
          .then(v => {
            this.emp = v.data
          })
          .catch(function (v) {})
      },
      // 查询当前入库
      initData () {
        let stoId = this.$route.query.stoId
        this.$axios.get('http://localhost:8088/sto-id', {
          params: {
            stoId : stoId
          }
        })
          .then(v => {
            this.storage = v.data
            if (this.storage.employeeByAffEmployeeId === null){
              this.storage.employeeByAffEmployeeId = ''
            }
            if (this.storage.returnByReturnId === null){
              this.storage.returnByReturnId = ''
            }
            this.findPurchase(this.storage.purchaseByPurchaseId.purchaseId)
            this.findPurDetail(this.storage.purchaseByPurchaseId.purchaseId)
            this.findInventory(this.storage.warehouseByWarehouseId.warehouseId)
          })
          .catch(function (v) {})
      },
      // 查询所有仓库
      findWarehouse() {
        this.$axios.get('http://localhost:8088/war-list')
          .then(v => {
            this.warehouseList = v.data
          })
          .catch(function (v) {
          })
      },
      // 查询所有入库明细
      findDetail(){
        let stoId = this.$route.query.stoId
        this.$axios.get('http://localhost:8088/sto-detail-list', {
          params:{
            stoId : stoId
          }
        })
          .then(v => {
            this.detailList = v.data
          })
          .catch(function (v) {})
      },
      // 查询当前采购
      findPurchase (purId) {
        this.$axios.get('http://localhost:8088/pur-id', {
          params: {
            purId : purId
          }
        })
          .then(v => {
            this.purchase = v.data
          })
          .catch(function (v) {})
      },
      // 查询采购明细
      findPurDetail(purId){
        this.$axios.get('http://localhost:8088/pur-detail-list', {
          params:{
            purId : purId
          }
        })
          .then(v => {
            this.purDetailList = v.data
          })
          .catch(function (v) {})
      },
      // 查询库存
      findInventory (warId) {
        this.$axios.get('http://localhost:8088/inv-all-list', {
          params: {
            warId:warId
          }
        })
          .then(v => {
            this.inventoryList = v.data
          })
          .catch(function (v) {})
      },
      // 修改入库单
      addStorage() {
        if(this.storage.employeeByAffEmployeeId === ''){
          this.storage.employeeByAffEmployeeId = null
        }
        if(this.storage.returnByReturnId === ''){
          this.storage.returnByReturnId = null
        }
        this.$axios.post('http://localhost:8088/save-storage',
          {
            storageId: this.storage.storageId,
            storageTheme: this.storage.storageTheme,
            storageDate: this.storage.storageDate,
            storageStatus: this.storage.storageStatus,
            storageNote: this.storage.storageNote,
            storageExecutorDate: this.storage.storageExecutorDate,
            warehouseByWarehouseId: this.storage.warehouseByWarehouseId,
            employeeByStoEmployeeId: this.storage.employeeByStoEmployeeId,
            employeeByAffEmployeeId: this. storage.employeeByAffEmployeeId,
            purchaseByPurchaseId: this.storage.purchaseByPurchaseId,
            returnByReturnId: this.storage.returnByReturnId,
            customerByCustomerId: this.storage.customerByCustomerId,
            storageDetailsByStorageId: this.detailList
          })
          .then(v => {
            // 1、刷新数据
            this.initData()
            this.findDetail()
            this.findWarehouse()
            this.$message({
              message: '已保存',
              type: 'success'
            });
          })
          .catch(function (v) {
          })
      },
      //删除提示
      repealSto(){
        this.$confirm('此操作将删除报价, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.deleteStorage()
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })
      },
      // 删除
      deleteStorage () {
        let stoId = this.$route.query.stoId
        this.$axios.post('http://localhost:8088/delete-storage',
          this.qs.stringify({stoId: stoId}))
          .then(v => {
            this.$router.push('/storage');
          })
          .catch(function (v) {})
      },
      //入库提示
      repealInv(){
        this.$confirm('此操作将入库, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.saveInventory()
          this.$message({
            type: 'success',
            message: '入库成功!'
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消入库'
          })
        })
      },
      // 入库计算库存
      saveInventory(){
        //计算采购明细与库存
        this.detailList.forEach(v => {
          this.purDetailList.forEach(va => {
            // 计算采购明细
            if (va.productByProductId.productId === v.productByProductId.productId){
              va.productDetailIntoNum += v.storageDetailNum
              va.productDetailOutNum = va.productDetailCount - va.productDetailIntoNum
            }
          })
          // 计算库存
          let is = true;
          this.inventoryList.forEach(val =>{
            if (val.productByProductId.productId === v.productByProductId.productId){
              val.inventoryNum += v.storageDetailNum
              is = false
            }
          })
          if (is){
            this.inventory.inventoryNum = v.storageDetailNum
            this.inventory.warehouseByWarehouseId = this.storage.warehouseByWarehouseId
            this.inventory.productByProductId = v.productByProductId
            this.inventoryList.push( this.inventory)
          }
        })
        // 判断是否完全入库
        let num = 0
        this.purDetailList.forEach(va => {
          if (va.productDetailOutNum === 0){
            num++
          }
        })
        if (num === this.purDetailList.length){
          this.purchase.purchaseStatus = 4
        }else {
          this.purchase.purchaseStatus = 3
        }
        this.addPurchase()
        this.addInventory()
        this.storage.storageStatus = 2
        this.storage.employeeByAffEmployeeId = this.emp
        this.storage.storageExecutorDate = this.addDate()
        this.addStorage()
      },
      //打开选择产品抽屉
      openPro(){
        this.drawer = true
        this.editDetailList = this.detailList
      },
      // 关闭抽屉事件
      closeDrawer(){
        this.editDetailList = []
      },
      // 从详单删除商品
      deleteDetail(val){
        let index=0;
        for(let i = 0; i < this.editDetailList.length; i++){
          if(this.editDetailList[i].productByProductId.productId === val.productByProductId.productId){
            index = i;
            break;
          }
        }
        this.editDetailList.splice(index,1)
      },
      //保存明细
      saveDetail(){
        this.addStorage()
        this.drawer = false
      },
      // 修改采购
      addPurchase() {
        this.$axios.post('http://localhost:8088/save-purchase',
          {
            purchaseId: this. purchase.purchaseId,
            purchaseTheme: this.purchase.purchaseTheme,
            purchaseNo: this.purchase.purchaseNo,
            purchaseDate: this.purchase.purchaseDate,
            purchasePredictDate: this.purchase.purchasePredictDate,
            purchaseStatus: this.purchase.purchaseStatus,
            purchaseSort: this.purchase.purchaseSort,
            purchaseAmount: this.purchase.purchaseAmount,
            purchaseNote: this. purchase.purchaseNote,
            purchaseContactName: this.purchase.purchaseContactName,
            purchaseBill: this.purchase.purchaseBill,
            purchasePaid: this.purchase.purchasePaid,
            purchaseAppStatus: this.purchase.purchaseAppStatus,
            purchaseReturn: this.purchase.purchaseReturn,
            customerByCustomerId: this.purchase.customerByCustomerId,
            employeeByEmpId: this.purchase.employeeByEmpId,
            customerByConCustomerId: this.purchase.customerByConCustomerId,
            contractByContractId: this.purchase.contractByContractId,
            employeeByAppEmpId: this.purchase.employeeByAppEmpId,
            warehouseByWarehouseId: this.purchase.warehouseByWarehouseId,
            productDetailsByPurchaseId: this.purDetailList
          })
          .then(v => {
          })
          .catch(function (v) {
          })
      },
      // 修改库存
      addInventory() {
        this.inventoryList.forEach(value => {
          this.$axios.post('http://localhost:8088/save-inventory',value)
            .then(v => {
            })
            .catch(function (v) {
            })
        })
      },
      // 获取当前日期
      addDate () {
        var date = new Date();
        var seperator1 = "-";
        var seperator2 = ":";
        var month = date.getMonth() + 1<10? "0"+(date.getMonth() + 1):date.getMonth() + 1;
        var strDate = date.getDate()<10? "0" + date.getDate():date.getDate();
        var currentdate = date.getFullYear() + seperator1  + month  + seperator1  + strDate
        return currentdate
      }
    },
    created() {
      this.loginEmp()
      this.initData()
      this.findDetail()
      this.findWarehouse()
    },
  }
</script>

<style scoped>
</style>
